<template>
  <div id="app">
    <h2>测试题</h2>
    <MySubject
    v-for="item in count" :key="item"
    @click-event="handleClick"
    ></MySubject>
    <div>
    <MyFlag 
    v-for="item in count" :key="item"
    :item="item"
    :flag="flag"
    :numNull="sum"
    ></MyFlag>
>
    </div>
  </div>
</template>

<script>
import MySubject from './components/my-subject.vue'
import MyFlag from './components/my-flag.vue'
export default {
  data() {
    return {
      flag:false,
      sum:null,
      count:5,
    }
  },
  components:{
    MySubject,
    MyFlag
  },
  methods:{
    handleClick(flag,num) {
      console.log(flag,num)
      this.flag =flag
      this.sum = num

    }
  }
};
</script>

<style>
body {
  background-color: #eee;
}

#app {
  background-color: #fff;
  width: 500px;
  margin: 50px auto;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
  padding: 2em;
}
</style>





